<template>
    <div class="root">
        <NavBar>首页</NavBar>
        
        <RoomList 
        :rooms = "list"
        @requestMore = "requestList"
        ></RoomList>
    </div>
</template>

<script>
import RoomList from "../components/RoomList"
    export default {
        components:{
            RoomList
        },
        data:function(){
            return {
                list:[],
                // isLoading:false,
                // networkErr:false
                dataState:"normal"
            }
        },
        mounted:function(){
            this.requestList();
        },
        methods:{
            //发请求函数
            requestList:function(){
                if(this.dataState=="loading"){
                    return;
                }
                this.dataState ="loading"
                this.$ajax.get("douyu/api/RoomApi/live",{
                    data:{
                        offset:Math.floor(this.list.length/30)
                    }
                })
                .then(res =>{
                    // console.dir(res.data)
                    // this.list  = res.data.data
                    this.list = this.list.concat(res.data.data)
                    this.dataState = "success"
                },()=>{
                    this.dataState = "fail"
                })
            }
        }
    }
</script>

<style scoped>
   
</style>